<template>
  <div>
    <div v-for="item in tabList" style="padding-top: 10px">
      <div class="mgl20 title">{{ item.CreateTime }}</div>
      <van-cell-group inset>
        <van-cell title="处理人" :value="$filterUserName(item.Processor)" />
        <van-cell title="处理方式" :value="item.Mode" />
        <van-cell title="发起人" :value="$filterUserName(item.CreateUser)" />
        <van-cell title="驳回原因" :value="item.BackReason" />
        <van-cell title="驳回时间" :value="item.BackTime" />
        <van-cell title="驳回人" :value="$filterUserName(item.BackUser)">
        </van-cell>
        <Popover
          label="处理人附件"
          Type="file"
          :required="false"
          :labelWeight="false"
          :showBtn="false"
          v-model="item.Process_Files"
        />
        <Popover
          label="驳回人附件"
          Type="file"
          :required="false"
          :labelWeight="false"
          :showBtn="false"
          v-model="item.Back_Files"
        />
      </van-cell-group>
    </div>
  </div>
</template>
<script setup name="SixHistory">
import { useRoute } from 'vue-router';
import { GetSixSaleProcessLogList } from '@/api/sixManage/sixData.js';
import { onMounted } from 'vue';
const route = useRoute();
const tabList = ref([]);
onMounted(() => {
  getDetail();
});
async function getDetail() {
  try {
    let res = await GetSixSaleProcessLogList({ ID: route.query.ID });
    tabList.value = res.data;
  } catch (error) {
    console.log(error);
  }
}
</script>

<style lang="scss" scoped>
.title {
  position: relative;
  padding-left: 10px;
  margin-bottom:4px;
  &::before {
    content: '';
    position: absolute;
    width: 4px;
    height: 16px;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    background-color: #1989fa;
    border-radius: 2px;
  }
}
</style>
